//
const networkUtil = require('../../../utils/networkutil.js')
const util = require('../../../utils/util.js')
const echarts = require('../../../component/ec-canvas/echarts.js')


const app = getApp()
var dataList = [];
var nameList = [];
var Chart = null;

Page({
    /**
     * 页面的初始数据
     */
    data: {
        startYear: null,
        endYear: null,
        year: null,
        month: null,
        monthReport: null,
        employeeMonthMeal: null,
        employee: null,
        date: null,
        isCalendarPickerShow: false,
        yearmonth: null,
        consumeMoneyData: null,
        ec: {
            lazyLoad: true, // 延迟加载,
            disableTouch: true
        }
    },
    showCalendarPicker() {
        this.setData({
            isCalendarPickerShow: true
        })
    },

    navigateDetail() {
        let that = this;
        wx.navigateTo({
            url: '../consumeInfoDay/consumeInfoDay?yearmonth=' + that.data.yearmonth
        })
    },

    onChangeDate(event) {
        let that = this;
        let _currentMonth = event.detail.currentMonth;
        let ret = _currentMonth.split('-');
        let _year = ret[0];
        let _month = ret[1];
        let _date = _year + '' + _month;
        that.setData({
            date: _date,
            year: _year,
            month: _month,
            isCalendarPickerShow: false,
            yearmonth: _year + _month
		    });
        that.getMonthComsumeInfo(_year + _month);
		that.getConsumeMoneyData(_year + _month);
        that.echartsComponnet = that.selectComponent('#mychart');
        that.getData(); //获取数据
    },


    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function(options) {
        console.log("--------------onLoad");

    },
    getData: function() {
        // 指定图表的配置项和数据
        let that = this;
        let url = app.globalData.baseUrl + "/consumeInfo/getLineData"
        let requestData = {
            yearmonth: that.data.yearmonth
        }

        networkUtil.request_get(url, requestData).then((res) => {
            let data = [];
            let name = [];
            //if (res.data.length > 0) {
            for (let i = 0; i < res.data.length; i++) {
                data.push(res.data[i].consumeMoney);
                name.push(res.data[i].consumeDate);
            }
            dataList = data;
            nameList = name;
            //如果是第一次绘制
            //if (!Chart) {
                this.init_echarts(); //初始化图表
          //  } else {
             //   this.setOption(Chart); //更新数据
          //  }
            //}
        }).catch((res) => {
            //若未获取到
            util.showToast("获取一周消费数据,出错!")
            return app.globalData.ERROR_STR
        })
    },

    //初始化图表
    init_echarts: function() {
        this.echartsComponnet.init((canvas, width, height) => {
            // 初始化图表
            Chart = echarts.init(canvas, null, {
                width: width,
                height: height
            });
            // Chart.setOption(this.getOption());
            this.setOption(Chart);
            // 注意这里一定要返回 chart 实例，否则会影响事件处理等
            return Chart;
        });
    },

    setOption: function(Chart) {
        //Chart.clear();  // 清除
        Chart.setOption(this.getOption()); //获取新数据
    },

    getOption: function() {
        var option = {
            color: ["#2ec7c9", '#b6a2de'], //图例图标颜色
            grid: {
                x: 50,
                x2: 50
            },
            xAxis: {
                type: 'category',
                name: '日期',
                data: nameList,
                axisLabel: {
                    interval: 0, // 横轴信息全部显示,
                    rotate: 40,
                    textStyle: {
                        fontSize: 11,
                        color: '#5D5D5D'
                    }
                },
                //设置轴线的属性
                axisLine: {
                    lineStyle: {
                        color: '#299cd4',
                        width: 2
                    }
                }
                //nameTextStyle: {//在name值存在下，设置name的样式
                //color: '#7cb5ec',
                //fontStyle: 'normal'
                //	},
            },
            yAxis: {
                type: 'value',
                name: '金额（元）',
				//splitLine: { show: false },去除网格线
				splitLine: {
					lineStyle: {
						// 使用深浅的间隔色
						color: '#EBEBEB'
					}
				},
                //scale: true,
                boundaryGap: [0, 0.2],
                //	nameTextStyle: {//在name值存在下，设置name的样式
                //color: 'red',
                //	fontStyle: 'normal'
                //	},
                axisLabel: {
                    textStyle: {
                        fontSize: 11,
                        color: '#5D5D5D'
                    },
                },
                //设置轴线的属性
                axisLine: {
                    lineStyle: {
                        color: '#299cd4',
                        width: 2
                    }
                }
            },
            series: [{
                    data: dataList,
                    type: 'line',
				    smooth:true,
                    markPoint: {
                        data: [{
                                type: 'max',
                                name: '最大值'
                            },
                            {
                                type: 'min',
                                name: '最小值'
                            }
                        ]
                    },
                    //itemStyle: { normal: { label: { show: true } } }
                },
                {
                    data: dataList,
                    barWidth: 23, //柱图宽度
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            label: {
                                show: true, //开启显示
                                position: 'inside', //在上方显示
                                textStyle: { //数值样式
                                    color: 'white',
                                }
                            }
                        }
                    }
                },
            ]
        }
        return option;
    },

    /**
     * 获取用户月结信息。
     */
    getMonthComsumeInfo: function(yearmonth) {
        let that = this
        let url = app.globalData.baseUrl + "/consumeInfo/getMonthComsumeInfoByMap"
        let requestData = {
            yearmonth: yearmonth
        }

        networkUtil.request_get(url, requestData).then((res) => {
            //若已获取到employeeMonthMeal
            that.setData({
				employeeMonthMeal: res.data ? res.data : null,
                //employee: res.data
            })
            return app.globalData.SUCCESS_STR
        }).catch((res) => {
            //若未获取到employeeMonthMeal
            util.showToast("获取消费补助月结信息,出错!")
            return app.globalData.ERROR_STR
        })
    },

    /***获取累计消费 */
	getConsumeMoneyData: function (yearmonth) {
        var that = this
        let url = app.globalData.baseUrl + "/consumeInfo/getConsumeMoneyData";
        let requestData = {
			yearmonth: yearmonth
        }
        networkUtil.request_get(url, requestData).then((res) => {
            let that = this
            that.setData({
				consumeMoneyData: res.data ? res.data : null
            })
        }).catch((res) => {
            //若未获取到employeeMonthMeal
            util.showToast("获取累计消费信息,出错!")
            return app.globalData.ERROR_STR
        })

    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function() {
		let nowDate = new Date();
		let _startYear = nowDate.getFullYear() - 5;
		let _endYear = nowDate.getFullYear();
		this.setData({
			startYear: _startYear,
			endYear: _endYear,
			year: nowDate.getFullYear(),
			month: util.formatNumber(nowDate.getMonth() + 1),
			date: nowDate.getFullYear() + '' + util.formatNumber(nowDate.getMonth() + 1),
			yearmonth: nowDate.getFullYear() + util.formatNumber(nowDate.getMonth() + 1)
		});
		this.getMonthComsumeInfo(nowDate.getFullYear() + util.formatNumber(nowDate.getMonth() + 1));
		this.getConsumeMoneyData(nowDate.getFullYear() + util.formatNumber(nowDate.getMonth() + 1));
		this.echartsComponnet = this.selectComponent('#mychart');
		this.getData(); //获取数据
    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function() {
		console.log("onshow........");
		
    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function() {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function() {

    },

})